﻿@model IEnumerable<PlaceSystem.Models.PlaceModel>

@*<div class="container">*@

@*<script type="text/x-kendo-tmpl" id="template">
    <div class="thumbnail" style="padding: 0">
        <div style="padding:4px">
            <img src="#:Pictures.FirstOrDefault().Url#" alt="300x200" style="width: 300px;height: 200px;" />
            <img alt="300x200" style="width: 100%" src="http://placehold.it/200x150">
        </div>
        <div class="caption">
            <h2>#:Name#</h2>
            <p>City - #:City#</p>
            <p>Category - #:Category#</p>
            <p><i class="icon icon-map-marker"></i><a href="/Home/Detail/#:Id#">Details</a></p>
        </div>
        @*<div class="modal-footer" style="text-align: left">
                <div class="progress progress-striped active" style="background: #ddd">
                    <div class="bar" style="width: 60%;"></div>
                </div>
                <div class="row-fluid">
                    <div class="span4"><b>60%</b><br /><small>FUNDED</small></div>
                    <div class="span4"><b>$400</b><br /><small>PLEDGED</small></div>
                    <div class="span4"><b>18</b><br /><small>DAYS</small></div>
                </div>
            </div>
    </div>
    </script>*@

@*<div class="demo-section">
    @(Html.Kendo().ListView<PlaceSystem.Models.PlaceModel>(Model)
    .Name("placeListView")
    .TagName("ul class='thumbnails'")
    .ClientTemplateId("template")
    //.BindTo(Model)
    .DataSource(dataSource =>
    {
        if (HttpContext.Current.Request.RequestContext.RouteData.Values["action"].ToString() == "Index")
        {
            dataSource.Read(read => read.Action("Index", "Home"));
        }
        if (HttpContext.Current.Request.RequestContext.RouteData.Values["action"].ToString() == "Search")
        {
            dataSource.Read(read => read.Action("Search", "Home"));
        }
        if (HttpContext.Current.Request.RequestContext.RouteData.Values["action"].ToString() == "ByUser")
        {
            dataSource.Read(read => read.Action("ByUser", "Home"));
        }
        dataSource.PageSize(2);
                    })
    .Pageable()
    )
</div>*@





@*<div class="row-fluid">
    <ul class="thumbnails">
            @if (Model.Count() > 0)
            {
                foreach (var item in Model)
                {
                    <li class="span3">
                        <div class="thumbnail" style="padding: 0">
                            <div style="padding:4px">
                                <img src="@item.Pictures.FirstOrDefault().Url" alt="300x200" style="width: 300px;height: 200px;" />
                                @*<img alt="300x200" style="width: 100%" src="http://placehold.it/200x150">*@
                        @*</div>
                        <div class="caption">
                            <h2>@item.Name</h2>
                            <p>City - @item.City</p>
                            <p>Category - @item.Category</p>
                            <p><i class="icon icon-map-marker"></i> @Html.ActionLink("Details", "Detail", "Home", new { id = item.Id }, null)</p>
                        </div>*@
                        @*<div class="modal-footer" style="text-align: left">
                                <div class="progress progress-striped active" style="background: #ddd">
                                    <div class="bar" style="width: 60%;"></div>
                                </div>
                                <div class="row-fluid">
                                    <div class="span4"><b>60%</b><br /><small>FUNDED</small></div>
                                    <div class="span4"><b>$400</b><br /><small>PLEDGED</small></div>
                                    <div class="span4"><b>18</b><br /><small>DAYS</small></div>
                                </div>
                            </div>*@
                    @*</div>
                </li>
            }
        }*@

        @*<li class="span3">
                <div class="thumbnail" style="padding: 0">
                    <div style="padding:4px">
                        <img alt="300x200" style="width: 100%" src="http://placehold.it/200x150">
                    </div>
                    <div class="caption">
                        <h2>Project B</h2>
                        <p>My project description</p>
                        <p><i class="icon icon-map-marker"></i> Place, Country</p>
                    </div>
                    <div class="modal-footer" style="text-align: left">
                        <div class="progress" style="background: #ddd">
                            <div class="bar bar-success" style="width: 100%;"></div>
                        </div>
                        <div class="row-fluid">
                            <div class="span4"><b>250%</b><br /><small>FUNDED</small></div>
                            <div class="span4"><b>$50000</b><br /><small>PLEDGED</small></div>
                            <div class="span4"><b>FUNDED</b><br /><small>AUG 5</small></div>
                        </div>
                    </div>
                </div>
            </li>
            <li class="span3">
                <div class="thumbnail" style="padding: 0">
                    <div style="padding:4px">
                        <img alt="300x200" style="width: 100%" src="http://placehold.it/200x150">
                    </div>
                    <div class="caption">
                        <h2>Project C</h2>
                        <p>My project description</p>
                        <p><i class="icon icon-map-marker"></i> Place, Country</p>
                    </div>
                    <div class="modal-footer" style="text-align: left">
                        <div class="progress" style="background: #ddd">
                            <div class="bar bar-danger" style="width: 30%;"></div>
                        </div>
                        <div class="row-fluid">
                            <div class="span4"><b>60%</b><br /><small>FUNDED</small></div>
                            <div class="span4"><b>$1000</b><br /><small>PLEDGED</small></div>
                            <div class="span4"><b>NOT FUNDED</b><br /><small></small></div>
                        </div>
                    </div>
                </div>
            </li>*@
        @*</ul>

        </div>
            </div>*@

    <ul class="thumbnails">
        @if (Model.Count() > 0)
        {
            foreach (var item in Model)
            {
                <li class="span3 home1">
                    <div class="thumbnail">
                        @*<img src="http://placehold.it/320x200" alt="ALT NAME">*@
                        <img src="@item.Pictures.FirstOrDefault().Url" alt="300x200" style="width: 200px;height: 150px;" />
                        <div class="caption">
                            <h3>@item.Name</h3>
                            <p>City - @item.City</p>
                            <p>Category - @item.Category</p>
                            @*<p align="center"><a href="http://bootsnipp.com/" class="btn btn-primary btn-block">Open</a></p>*@
                            <p align="center" class="btn btn-primary btn-block">@Html.ActionLink("Details", "Detail", "Home", new { id = item.Id }, null)</p>
                        </div>
                    </div>
                </li>
            }
        }
        else
        {
            <li class="span12">
                <h4>There are currently no added place</h4>
            </li>
        }

    </ul>
